<template>
  <view class="u-flex-y-center u-flex-between u-flex-wrap u-p-20">
    <videoItem :page="`${page}?id=${item.id}&type=${item.user_id == userInfo.id?1:2}`" :item="item"
      v-for="(item,index) in list" :key="item.id">
      <view class="u-flex-y-center hot-box" v-if="type == 1">
        <u-image src="/static/images/01_36hjm.png" :fade="false" width="22rpx" height="30rpx"></u-image>
        <u-text :text="item.score" color="#fff" size="13" margin="0 14rpx"></u-text>
      </view>
    </videoItem>
  </view>
  <u-empty v-if="!list.length" margin-top="50"></u-empty>
  <view class="live-btn" @click="$u.route('/pages/index/houseLive/startLive')"
    v-if="type == 1 && userInfo.is_live == 1">开启直播</view>
  <back-page></back-page>
</template>

<script setup>
  import { computed, onMounted, ref } from 'vue';
  import videoItem from '@/components/video-item/video-item.vue'
  import { liveList, videoList, userinfo } from '@/config/api';
  import { onReachBottom, onShow } from '@dcloudio/uni-app'
  import { getCache, setCache } from '@/util/util';
  const props = defineProps({
    type: {
      type: [Number, String],
      default: 1
    }
  })
  const page = computed(() => {
    if (props.type == 1) return '/pages/index/houseLive/livePusher'
    else return '/pages/index/houseLive/houseVideo'
  })
  const list = ref([])
  const params = ref({
    page: 1,
    limit: 15
  })
  const userInfo = ref({})
  uni.setNavigationBarTitle({
    title: props.type == 1 ? '房源直播' : '小视频'
  })
  onShow(() => {
    if (props.type == 1) _liveList()
    else _videoList()
    _userinfo()
  })
  onReachBottom(() => {
    params.value.page++
    if (props.type == 1) _liveList()
    else _videoList()
  })
  const _userinfo = () => {
    userinfo().then(res => {
      setCache('userInfo', res.data)
      userInfo.value = res.data
    })
  }
  // 直播列表
  const _liveList = () => {
    liveList(params.value).then(res => {
      if (params.value.page == 1) list.value = res.data
      else list.value = list.value.concat(res.data)
    })
  }
  // 视频列表
  const _videoList = () => {
    videoList(params.value).then(res => {
      if (params.value.page == 1) list.value = res.data.data
      else list.value = list.value.concat(res.data.data)
    })
  }
</script>

<style scoped lang="scss">
  .hot-box {
    position: absolute;
    bottom: 75rpx;
    left: 12rpx;
  }

  .live-btn {
    position: fixed;
    bottom: env(safe-area-inset-bottom);
    left: 30rpx;
    right: 30rpx;
    background: #f87610;
    border-radius: 50rpx;
    font-size: 30rpx;
    color: #fff;
    font-weight: 500;
    text-align: center;
    line-height: 90rpx;
  }
</style>